<template>
    <div class="shopCar">
        <div class="top">
            <img :src="require('@/assets/shop/back.png')" alt="" class="back" @click="$router.go(-1)" />
            <div class="top_input">
                <img :src="require('@/assets/shop/search.png')" alt="" class="img" />
                <input type="text" placeholder="搜索订单" v-model="name" />
            </div>
            <div class="message" @click="open">
                <img :src="require('@/assets/shop/kefu.png')" alt="" class="message-img" />
      
            </div>
        </div>
        <div class="select_border_position">
            <van-dropdown-menu active-color="#01a862">
                <van-dropdown-item v-model="value1" :options="option1" :title="title1" @change="changeDevelop1" />
                <van-dropdown-item v-model="value2" :options="option2" :title="title2" @change="changeDevelop2" />
                <van-dropdown-item v-model="value3" :options="option3" :title="title3" @change="changeDevelop3" />

            </van-dropdown-menu>
        </div>
        <div class="shopbar">
      
            <div class="right">
 
                <div class="shoplist" style="background:#f2f2f2">
                    <van-list v-model="loading" :finished="finished" finished-text="没有更多了"  @load="onShowsDown" :offset="offset" :immediate-check="false">
 
                        <div class="item" v-for="(k, index) in list" :key="index">
                            <img v-lazy="checkPic(k.PIC)" alt="" class="item-img" />
                            <div class="pro">
                                <div class="title"> 买方：{{ k.USER_ID_NAME }}</div>
                                <div class="title"> 金额：{{ k.MONEY_PRO }}</div>
                                <div class="title"> 数量：{{ k.PRO_COUNT }}</div>
                                <div class="title"> 商品：{{ k.PRO_NAME }}</div>
                                <div class="title"> 规格：{{ k.PRO_TYPE_NAME }}</div>
                                <div class="title" v-if="k.STATE==0"> 状态： 未支付</div>
                                <div class="title" v-if="k.STATE==1.0"> 状态： 已支付</div>
                                <!-- <div class="title"> 收货人：{{ k.ADDR_PERSON_NAME }}</div>
                                <div class="title"> 地址：{{ k.ADDRESS }}</div>
                                <div class="title"> 电话：{{ k.ADDR_PERSON_TEL }}</div> -->

                            </div>
                            <div class="pay">
                         <!-- v-if="k.STATE==1.0  &&  k.STATE2==0.0" -->
                                <div class="sendstatus"  @click="$router.push('/userCode')"> 验票</div>
                            </div>
                        </div>
                    </van-list>
                    <!-- <div class="yanp"> 验票</div> -->
                </div>
            </div>
        </div>
 
        <!-- 弹窗开始 -->
        <div class="zg" v-show="isShow"></div>
        <div v-show="isShow" class="tc" @touchmove.prevent @mousewheel.prevent>
            <div class="ke">
                <div class="p">客服</div>

                <img class="wexin" :src="require('@/assets/shop/WeChat.jpg')" alt="">
                <a href="tel:0532-87849393">
                    <div class="li">
                        <p class="tell">联系电话：0532-87849393</p>

                        <img :src="require('@/assets/shop/tell.png')" alt="">
                    </div>
                </a>
                <!-- <p class="add"><a href="tel:15020272559">联系电话：15020272559</a>
                    <img :src="require('@/assets/shop/tell.png')" alt="">
                </p> -->
            </div>
            <div class="close" @click="open">×</div>
        </div>

        <!-- 弹窗结束 -->
 

        <!-- 底部栏 -->
        <v-footer2 background="#f2f2f2"></v-footer2>
    </div>
</template>
<script>    
import "@/css/shop/main.scss";
import Footer2 from "@/common/travel/_footer2.vue";
import Util from "../../util/common";
export default {
    components: {
        "v-footer2": Footer2,
    },
    data() {
        return {
            isShow: false,
            issendShow: false,
            name: "",
            value1: "",
            value2: "",
            value3: "",

            title1: '分类',
            title2: '订单状态',
            title3: '验单状态',
            sortlist: [],
            offset: 100,
            sortId: 0,
            zt: 0,

            option1: [

            ],
            option2: [
                { text: "所有", value: "0" },
                { text: "未支付", value: "1" },// value+1
                { text: "已支付", value: "2" },  // value+1


            ],
            option3: [
                { text: "待发货", value: "0" },// value+1
                { text: "已发货", value: "1" },// value+1
                { text: "已收货", value: "2" },// value+1
                { text: "完成", value: "3" },// value+1
            ],
            activeKey: 0,
            active: 2,
            // tag
            optionValue: {
                id: "",
            },
            list: [],
            sortlist: [],
            loading: false,
            finished: false,
            pageNum: 0,
            // 左边
            allData: [{ list: [{ list: [] }] }],
            Sortid: 0,
        };
    },
    created() {
        this.shuju();
        this.activeKey = this.$store.state.category.tabIndex;
    },
    watch: {
  
       
    },
    methods: {
 
   
     onShowsDown(e){
        var that = this;
        setTimeout(function() {
          that.shuju()
        }, 1000);

      },
        changeDevelop2(i) {
            this.finished = false
            this.value2 = i
            this.title2 = this.option2[i].text
            this.zt = i
            this.finished = false
    
            this.list = []
            this.pageNum = 0
            this.shuju()
 
        },
        changeDevelop3(i) {
            this.value3 = i
            this.title3 = this.option3[i].text
        },
        //点击选项
 
        checkPic: function (picurl) {
            return this.$conf.domain + "/" + picurl;
        },
     
 
        open() {

            this.isShow = !this.isShow
        },
        sendshow(k) {
           // this.issendShow = !this.issendShow
            this.$router.push({ path: '/shop/sendOrder', query: { info: k } });
        },
  
        shuju() {
            //this.loading=true;
            this.sortId = this.$route.query.sortId;

            this.$dopost(
                "/sysapi/order/shopOrder/",
                {
                     get_detail: 1,
                    viewloading: 0,
                    page: this.pageNum + 1,
                    shopId: this.$route.query.shId, //6681572
                    api_user: this.$store.state.login.username,
                    // PRO_SORT: 1493,
                    PRO_SORT: this.sortId,
                    zt: this.zt,
                },

                function (res) {
                    if (
                        res.data &&
                        typeof res.data.error != "undefined" &&
                        res.data.error === 0
                    ) {
                        let a = [];
                        this.sortlist = res.data.data.sortlist;

                        //text: "已支付", value: "1" 
                        a[0] = { text: '所有', value: 0 }
                        for (let i = 0; i < res.data.data.sortlist.length; i++) {
                            //  a[i+1] = { text: res.data.data.sortlist[i]["NAME"], value: i+1}
                            a[i] = { text: res.data.data.sortlist[i]["NAME"], value: i }

                        }
                        this.option1 = a;


                        console.log(res.data, 1234568);
                        if (
                            this.$store.state.index.currentPage.page != window.location.href
                        ) {
                            this.$store.state.index.currentPage.page = window.location.href;
                        }
                        for (let i = 0; i < res.data.data.ORDER.length; i++) {
                            this.list.push(res.data.data.ORDER[i]);

                        }

                        this.pageNum = parseInt(res.data.data.page);
                        if (
                            parseInt(res.data.data.page) >= parseInt(res.data.data.allpage)
                        ) {
                            this.finished = true;
                        }
                        this.loading = false;
                    } else {
                        Toast(res.data && res.data.mess ? res.data.mess : "接口错误");
                    }
                }.bind(this)
            );
        },

        goDetails(k) {
            console.log(k)
            this.$store.commit("GET_PRODETAILS", k);

            this.$router.push({ path: "/shop/details", query: { id: k.ID } });
        }, 

    },
};
</script>